import { memo } from "react";
import type { ReactNode } from "react";
import Header from "./components/Header";
import Footer from "@/layouts/components/Footer";
import GoTop from "./components/GoTop";
import { ScrollToTop } from "@/components/ScrollToTop";

interface LayoutProps {
  children: ReactNode;
}

const Layout = memo(({ children }: LayoutProps) => {
  return (
    <div className="min-h-screen bg-gray-100">
      <ScrollToTop />
      <Header />
      <main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8" style={{ minHeight: "calc(100vh - 380px)" }}>
        {children}
      </main>
      <Footer />
      <GoTop />
    </div>
  );
});

Layout.displayName = 'Layout';

export default Layout;